<style type="text/css">
.layout_clear{clear:both;}
#style_tool_bar h3{ text-align:left;}
#style_tool_bar ul {background: #e6e6e6 url(<?=$this->baseUrl;?>/public/styles/jquery/images/tab_bg.gif) 0 50% repeat-x; width:100%; margin-top:0px;}
#style_tool_bar ul li{border-right: 1px solid #ccc;}
#style_tool_bar ul li a{ font-weight:bold;}
.layout_line{margin-top:10px;}
.layout_line div{width:52px; height:60px; float:left; margin-left:10px;}
.layout_bs1_1{background:url(/public/images/t.gif) no-repeat 0 -440px;}
.layout_bs2_1{background:url(/public/images/t.gif) no-repeat 0 -250px;}
.layout_bs2_2{background:url(/public/images/t.gif) no-repeat 0 -312px;}
.layout_bs2_3{background:url(/public/images/t.gif) no-repeat 0 -375px;}
.layout_bs3_1{background:url(/public/images/t.gif) no-repeat 0 0;}
.layout_bs3_2{background:url(/public/images/t.gif) no-repeat 0 -60px;}
.layout_bs3_3{background:url(/public/images/t.gif) no-repeat 0 -123px;}
.layout_bs3_4{background:url(/public/images/t.gif) no-repeat 0 -185px;}
.layout_view_line{border:#0066FF dotted 2px; height:40px; background:#DAE7F3;}
.layout_module li{display:block; float:left; width:235px; height:25px; margin:5px 0 0px 0; text-align:left; font-weight:normal;}
.sortableItem h2{cursor:move;}
#tab_pannel{ padding-right:2px;}
#fragment-1,
#fragment-2,
#fragment-3,
#fragment-4,
#fragment-5,
#fragment-6{ background:#fff url(<?=$this->baseUrl;?>/public/spaces/img/mb_top_bg.gif) 0 bottom repeat-x; border:1px #ABBDDE solid; padding-bottom:20px;}
#fragment-4 li,
#fragment-5 li,
#fragment-6 li{ float:left; width:19%; text-align:center; margin-bottom:5px;}
#fragment-4 li a img,
#fragment-5 li a img,
#fragment-6 li a img{ border:1px #ccc solid; padding:2px;}
#fragment-4 li a span,
#fragment-5 li a span,
#fragment-6 li a span{ display:block; color:#666; text-decoration:none;}
#fragment-4 li a:hover img,
#fragment-5 li a:hover img,
#fragment-6 li a:hover img{ border:1px #FFCC00 solid;}
#fragment-6 h2{ font-size:12px; margin-bottom:10px; background:url(/public/images/banner_line.gif) 0 bottom no-repeat; line-height:20px; font-weight:normal; height:20px; text-align:left;}
#fragment-6 h2 span{ display:block; padding-left:10px; background:url(/public/images/icon_banner.gif) 0 center no-repeat;}
#fragment-6 h2 a{ color:#FF3300;}
#fragment-6 .mb-div{ overflow-x:hidden;overflow:scroll; height:140px;}
#fragment-6 li{margin-bottom:10px;}
/*.menu_item{float:left; width:210px; padding:3px; margin-left:15px;}*/
</style>
<!--<script language="javascript" type="text/javascript" src="<?=$this->baseUrl;?>/public/scripts/SevenColorPicker.js"/></script>
-->
<script language="javascript">

var sortableChange = function(e, ui){
	if(ui.sender){
		//var w = ui.element.width();
		//ui.placeholder.width(w);
		ui.helper.css("width",ui.placeholder.width());
	}
};

$(document).ready(function(){
	var els = ['#left', '#right', '#center'];
	var $els = $(els.toString());
	
	$els.sortable({
		items: '> .sortableItem',
		handle: 'h2',
		cursor: 'move',
		//cursorAt: { top: 2, left: 2 },
		//opacity: 0.8,
		helper: 'clone',
		//appendTo: 'body',
		//containment: 'document',
		placeholder: "layout_view_line", 
		//forcePlaceholderSize: true,
		tolerance: 'pointer',
		distance: 5,
		scroll: true,
		/*revert: true, */
		//placeholder: 'clone',
		//placeholder: 'placeholder',
		connectWith: els,
		start: function(e,ui) {				
			ui.helper.css("width", ui.placeholder.width());
		},
		change: sortableChange
		
	});	
	
	
});	

//保存模块排序
function savelayout(){

	document.moduleForm.layoutinfo.value = $('#left').sortable('serialize',{key:'leftmod[]'}) + '&' + $('#right').sortable('serialize',{key:'rightmod[]'}) + '&' + $('#center').sortable('serialize',{key:'centermod[]'});
	alert(document.moduleForm.layoutinfo.value);
}

//删除模块
function removeModule(code)
{
	$("#module_" + code).remove(); 
}

//添加模块
function addModule(code,place)
{
		
	$.post("<?=$this->url(array('module'=>'com','controller'=>'module','action'=>'get','lan'=>$this->lang,'uid'=>$this->uid),NULL,true);?>",{'code':code},	
	function(data){
		//alert(data);
		$('#' + place).append(data)
	})
	
}

//添加、删除模块
function setModule(t)
{
	if(t.checked == true){
	var tmp = null;		
		addModule(t.value , 'center');
	}else{
		removeModule(t.value);
	}
}


//关闭编辑功能
function closeEdit()
{	
	if(!confirm('<?=$this->t('spc_exit_confirm');?>'))return;
	$('#style_tool_bar').hide();	
	$('#left').sortable( "disable" );
	$('#center').sortable( "disable" );
	$('#right').sortable( "disable" );
	
	$.post("<?=$this->comUrl('module','exit');?>" ,null,
	function(data){	
		document.location.reload();		
	});
}


$(document).ready(
 	function (){		
		//空间管理导航条
		$("#tab_pannel > ul").tabs();
		
		//设置首页模块可排序
		$('.sortableItem h2 > a').css('display','none');		
		$('.sortableItem > h2').mouseover(function(){
		 	$(this.parentNode).css({"border":"2px dotted #0066FF", "opacity":"0.8"});
		}
		);		
		$('.sortableItem > h2').mouseout(function(){
			if($.browser.msie){
				$(this.parentNode).removeAttr('style');
			}else{
		 		$(this.parentNode).css({"border":"", "opacity":""});
			}
		}
		);
		
	}
 );
</script>

<div style="display:; width:99%; margin:5px auto 0 auto;" id="style_tool_bar">
<form action="<?php echo $this->urls('save','modules','space',array(),'membersave');?>" name="moduleForm" method="post">
<div id="tab_pannel">
<ul>
<div style="float:right;">
<input type="hidden" name="layoutinfo" id="layoutinfo" />
  <input type="submit" name="button4" id="button4" value="<?=$this->t('spc_save_edit');?>" onclick="savelayout();" style="background:#FFCC33; border:1px #FF6600 solid;" />
  <input type="button" name="button5" id="button5" value="<?=$this->t('spc_cancel');?>" onclick="closeEdit();" />
  <input type="hidden" name="bannerurl" value="<?=$this->spacesetting['bannerurl'];?>" />
  <input type="hidden" name="bannerurloldvalue" value="<?=$this->spacesetting['bannerurl'];?>" />
  <input type="hidden" name="skinid" value="<?=$this->spacesetting['skin'];?>" />
  <input type="hidden" name="styleid" value="<?=$this->spacesetting['style'];?>" />
  <input type="hidden" name="contentclass" value="<?=$this->spacesetting['contentclass'];?>" />
  <input type="hidden" name="blogname" value="<?=$this->spacesetting['blogname'];?>" />  
  <input type="hidden" name="templateid" id="templateid" value="<?=$this->spacesetting['template'];?>" />
  <input type="hidden" name="logoCss" id="logoCss" value="<?=$this->spacesetting['css']['logoCss'];?>" />
  <input type="hidden" name="companyNameCss" id="companyNameCss" value="<?=$this->spacesetting['css']['companyNameCss'];?>" />
  <input type="hidden" name="sloganCss" id="sloganCss" value="<?=$this->spacesetting['css']['sloganCss'];?>" />
  <input type="hidden" name="searchCss" id="searchCss" value="" />
</div>
<li><a href="#fragment-1"><?=$this->t('spc_mod_man');?></a></li>
<li><a href="#fragment-3"><?=$this->t('spc_nav_man');?></a></li>

</ul>
<br style="clear:both;" />
</div>

<div id="fragment-1" style="display:none;">
<ol class="layout_module">
<?

$unusemodulekey = $this->spacesetting['modules'];
$moduleArray = $this->sysmodules;
foreach ($moduleArray as $key=>$mod){
?>
<li>
  <input name="mod<?=$mod['module_id'];?>" type="checkbox" id="mod<?=$mod['module_id'];?>" value="<?=$mod['module_field'];?>" onclick="setModule(this);"<?=(in_array($mod['module_field'],$unusemodulekey) or empty($unusemodulekey))?' checked="checked"':'';?> />
  <?=$this->menuname[$mod['module_field']];?></li>
  <? } ?>
</ol>
  <div class="clear"></div>
  <? if($this->authInfo->memb_type!='b2b'){?>
  <h2><?=$this->t('spc_ads_mod');?></h2>
<ol class="layout_module">
<? 
if(count($this->adplaces)>0){
foreach($this->adplaces as $adplace){?>
<li><input name="mod-ads-<?=$adplace['place_id'];?>" type="checkbox" id="mod-ads-<?=$adplace['place_id'];?>" value="ads<?=$adplace['place_id'];?>" onclick="setModule(this);"<?=in_array('ads'.$adplace['place_id'],$this->spacesetting['modules'])?' checked="checked"':'';?> />
  <?=$adplace['place_name'];?></li>
<? }}else{ ?>
<li><?=$this->t('no_ads_module');?><a href="<?=$this->baseUrl;?>/comadmin/ads/addplace"><?=$this->t('add_ads_module');?></a></li>
<? } ?>
</ol>
<div class="clear"></div>
<? } ?>
</div>



<div id="fragment-3" style="display:none;">
 
<ol class="layout_module">
      <?	
	 $usermenus = $this->userMenus;
	 $sysmenus = $this->nonExistsMenus;
	  if(is_array($usermenus))foreach($usermenus as $menu){ ?>
<li style="width:24%;"><input name="umenu_isshow[<?=$menu['code'];?>]" type="checkbox" value="1" checked="checked" style="float:left; width:20px;" />
          <input type="text" name="umenu_name[<?=$menu['code'];?>]" value="<?=$menu['name'];?>" style="width:80px;" />
          <input name="umenu_listorder[<?=$menu['code'];?>]" type="text" value="<?=$menu['order'];?>" size="10" maxlength="3" style="width:30px;" />
</li>
      <? 	 
	  } ?>
      <?	 
	  if(is_array($sysmenus))foreach($sysmenus as $menu){	  	
	  	?>
      <li style="width:24%;"><input name="umenu_isshow[<?=$menu['code'];?>]" type="checkbox" value="1" style="float:left; width:20px;" />         
          <input type="text" name="umenu_name[<?=$menu['code'];?>]" value="<?=$menu['name']; ?>" style="width:80px;" /> 
          <input name="umenu_listorder[<?=$menu['code'];?>]" type="text" size="10" maxlength="3" style="width:30px;" value="<?=$menu['order'];?>" /></li>
      <? 	 
	  } ?>
</ol>
<div class="clear"></div> 
  </div>
  </form>
<div style="clear:both;"></div>
</div>
<div style="margin:5px;"></div>
